<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
<meta content="yes" name="apple-mobile-web-app-capable" />
<meta content="black" name="apple-mobile-web-app-status-bar-style" />
<meta content="telephone=no" name="format-detection" />
<meta content="email=no" name="format-detection" />
<title></title>
<link rel="stylesheet" type="text/css" href="../../css/hui.css" />

<link rel="stylesheet" href="../../css/s_plus.css" />
<link rel="stylesheet" href="../../css/base.css" />
<link rel="stylesheet" href="../../css/layout.css" />
<link rel="stylesheet" href="../../css/choice.css" />
<script type="text/javascript" src="../../libs/vue.js" ></script>
<script type="text/javascript" src="../../js/jquery.1.9.1.min.js" ></script>
<script type="text/javascript" src="../../js/app/url.js" ></script>
<script type="text/javascript" src="../../libs/hui.js" ></script>
<script type="text/javascript" src="../../js/s_plus.js" ></script>
<script type="text/javascript" src="../../js/md5.js"></script>
<script type="text/javascript" src="../../js/app/api.js"></script>
<script type="text/javascript" src="../../js/control/mescroll/mescroll.min.js"></script>
<link rel="stylesheet" href="../../js/control/mescroll/mescroll.min.css" />

<script type="text/javascript" src="../../js/control/swal/sweetalert.min.js"></script>
<link rel="stylesheet" href="../../js/control/swal/sweetalert.css" />

	<script src="../../js/control/lrz.bundle.js"></script>
		<link rel="stylesheet" href="../../css/spinkit.css" />
		<script src="../../js/mui.min.js"></script>
</head>
<body>
	<div id="wrapper">
<header class="f_l maxbox subhead">
  <a class="back"  @click="back"><i class="iconfont">&#xe605;</i></a>
  <h1>工单详情</h1>
</header>
<h2 class="f_l maxbox work_state"><i class="iconfont red">&#xe610;</i><b class="mar_l">{{workState}}</b></h2>
<section class="f_l maxbox work_info"  >
<p>标题：{{work.alarmTitle}}</p>
<p>内容：{{work.alarmContent}}</p>
<p>告警类别: {{showAlerm(work.alarmCate)}}</p>
<p>渠道：{{showChannel(work.channel)}}</p>
 <p>时间: {{work.createDateStr}}</p>
 <!--<p>终端ID：{{work.zdId}}</p>-->
</section>

<template v-if="jg">
<section class="f_l maxbox work_info" >
	<p>井盖ID：{{jg.jgCode}}</p>
  <p>材质:{{showMetal(jg.material)}}</p>
  <p>型号规格：{{showModel(jg.model)}}</p>
  <p>长度/长径(mm)：{{jg.modelSize1}}</p>
  <p>宽度/短径(mm)：{{jg.modelSize2}}</p>
  <p>承载等级：{{jg.bearLevel}}</p>
  <p>建设时间：{{jg.constructionTime}}</p>
  <p>使用年限：{{jg.useFixedYear}}</p>
</section>
	</template>

<template v-if="zd.termimalCode">
	
<section class="f_l maxbox txt_list" >

		<p><em>终端ID：</em>{{zd.termimalCode}}</p>
				<p><em>责任单位：</em>{{zd.respUnit}}</p>
				<p><em>告警状态：</em>{{showStatus(zd.status)}}</p>
				<p><em>工程状态：</em>生产中</p>
				<p><em>安装时间：</em>{{zd.installTime}}</p>
				<p><em>经纬度:</em>{{zd.longitude}},{{zd.latitude}} &nbsp;&nbsp;<a @click="nav(zd.latitude,zd.longitude)">导航 <i class="iconfont mar_l"></i></a>
				</p>

</section>
</template>



<section class="f_l work_record">
  <hr />
  <div class="f_l record_time">

  </div>
  <div class="f_l maxbox record_step">
    

  </div>
</section>

<section class="f_l maxbox txt_list" >

	
				<p v-for="item in worklist"><em>{{item.createDateStr}}  </em>  {{item.workContent}}</p>
				<!--<p><em>{{item.createDateStr}}：</em>{{item.workContent}}</p>-->
				<!--<p><em>安装时间：</em>{{zd.installTime}}</p>-->
			

</section>

	<section class="f_l maxbox  block_three" v-if="work.scenePhoto !=null">
				<dl>
					<dt>
      <h2>现场照片</h2>

    </dt>
					<dd class="photo_list">
						<ul>
	
<li  v-for="it in  cutImgs(work.scenePhoto)">  <img class="imgs" @click="showImg($event)"  :src="it" /></li>
					
						</ul>
					</dd>
				</dl>
			</section>

	<section class="f_l maxbox block_two" v-if="status != '30'">
				<dl>
					<dt>
      <h2>上传图片</h2>
    </dt>
					<dd class="photo_list">
						<ul>

							<li v-for="item in imgs"><img :src="item" alt="" /></li>
							<!--<li><img src="../../images/map.jpg" alt="" /></li>
        <li><img src="../../images/map.jpg" alt="" /></li>-->
							<li>
								<a id="selectImgBtn"><i class="iconfont">&#xe626;</i></a>
							</li>
							<!--<li><input class="fileControl" id="picture" type="file" accept="image/*" multiple="multiple"></li>-->

							<!--<li><input class="fileControl"  type="button" id="selectImgBtn" value="选择图片"></li>-->
						</ul>
					</dd>
				</dl>
			</section>

<section class="f_l maxbox block_two ">
	<div style="text-align: center;">
		
<template v-if="status === '30'">
  <a id="chuli" @click="chuli" class="btn mian_btn mar_l">接收</a>
</template>
<template v-else-if="status === '40'">
<dl>
    <dt>
      <h2>进一步处理备注</h2>
    </dt>
    <dd>
     <textarea v-model="remark" class="area noEmojiText" name="" cols="" rows=""></textarea> 
    </dd>
  </dl>
  <dl>
    <dt>
      <h2>告警原因</h2>
    </dt>
    <dd>
     <textarea v-model="alarmReason" class="area noEmojiText" name="" cols="" rows=""></textarea> 
    </dd>
  </dl>
	
 <a @click="jybcl" class="btn mian_btn mar_l">进一步处理</a>
<a id="wanc" @click="over" class="btn minor_btn">完成</a>

</template>

<template v-else-if="status === '50'">
	<dl>
    <dt>
      <h2>进一步处理备注</h2>
    </dt>
    <dd>
     <textarea  v-model="remark" class="area noEmojiText" name="" cols="" rows=""></textarea> 
    </dd>
  </dl>
  <dl>
    <dt>
      <h2>告警原因</h2>
    </dt>
    <dd>
     <textarea class="area noEmojiText" v-model="alarmReason" name="" cols="" rows=""></textarea> 
    </dd>
  </dl>
	
<a id="wanc" @click="over" class="btn minor_btn">完成</a>
</template>

<template v-else>
	
</template>
	</div>
 
</section>
<!--<section class="f_l maxbox mar_t mar_f t_c">
  <a class="btn  minor_btn " href="">进一步处理</a>
  <a class="btn mian_btn mar_l" href="">完成</a>
</section>-->

<section class="f_l maxbox mar_t mar_f t_c" id="handle">
  <!--<a class="btn mian_btn" href="work_handle.html">处理</a>-->
  
  
</section>

</div>

<div class="f_l maxbox mar_t">&nbsp;</div>



		<script type="text/javascript" src="../../js/control/phoneswipe/photoswipe.min.js" charset="UTF-8"></script>
<script type="text/javascript" src="../../js/control/phoneswipe/photoswipe-ui-default.min.js" charset="UTF-8"></script>
<link rel="stylesheet" href="../../js/control/phoneswipe/photoswipe.css" type="text/css" />		
		<!-- 以下为 phoneSwipe 插件 dom 复制即可 -->
<div class="pswp" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="pswp__bg"></div>
    <div class="pswp__scroll-wrap">
        <div class="pswp__container" style="overflow:visible;">
            <div class="pswp__item"></div>
            <div class="pswp__item"></div>
            <div class="pswp__item"></div>
        </div>
        <div class="pswp__ui pswp__ui--hidden">
            <div class="pswp__top-bar">
                <div class="pswp__counter"></div>
                <button class="pswp__button pswp__button--close" title="关闭"></button>
                <div class="pswp__preloader">
                    <div class="pswp__preloader__icn">
                      <div class="pswp__preloader__cut">
                        <div class="pswp__preloader__donut"></div>
                      </div>
                    </div>
                </div>
            </div>
            <div class="pswp__share-modal pswp__share-modal--hidden pswp__single-tap">
                <div class="pswp__share-tooltip"></div> 
            </div>
            <div class="pswp__caption">
                <div class="pswp__caption__center"></div>
            </div>
        </div>
    </div>
</div>

<script type="text/javascript" src="work_show.js?time=20190104221"></script>

</body>
</html>